<template>
  <div id="app">
    <header class="head">
      <a class="back tl" href="javascript:history.back(-1)">
        <i class="el-icon-arrow-left"></i>
      </a>
      <a href="javascript:;" class="tc">
        <small class="font_18 co_f">评价</small>
      </a>
    </header>
    <main>
       <div class="comment">
          <textarea id="t" name="textarea" placeholder="请输入你的评价.."></textarea>
          <button>提交</button>
       </div>
    </main>
  </div>
</template>

<script type="text/ecmascript-6">
  
  export default {
    data() {
      return {
       
      };
    },
    methods: {
      
    },
    //页面加载时候
    created() {
    
    }
  
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="scss" scoped>
  //头部
a {
  list-style: none;
  text-decoration: none;
}

header {
  width: 100%;
  height: 45px;
}

.head {
  background: #008c3f;
  color: #fff;
  line-height: 45px;
  text-align: center;
  font-size: 1.2rem;
  position: relative;
}

header .head a:nth-child(2) {
  width: 100%;
}

.font_18 {
  font-size: 1.2rem;
}

.co_f {
  color: #fff !important;
}

.back {
  position: absolute;
  top: 0px;
  left: 0px;
  i {
    color: #fff;
    vertical-align: middle;
    margin-left: 5px;
  }
}

//
.comment{
  width: 96%;
  margin:2% auto;
  overflow: hidden;
  textarea{
  width: 100%;
  margin: 2% 0%;
  min-height: 150px;
  border: 1px solid #efefef;
  padding:2%;
}
button{
  background: #dad9d9;
  color: #fff;
  width: 100%;
  height: 45px;
  line-height: 45px;
  border: none;
  margin: 2% auto;
}
}
</style>
